$(function () {
    let bcjData;
    let contentData;
    // let index;
    init()
    function init() {
        bcjTitleData()
        bcjContentData()
        eventList()
        bcjContentData(0)
    }
    // 白菜价标题数据
    function bcjTitleData() {
        $.get("http://193.112.55.79:9090/api/getbaicaijiatitle",
            function (result) {
                // if(result.length)
                bcjData = result.result;
                // 头部渲染
                let html = '';
                for (let i = 0; i < bcjData.length; i++) {
                    html += `<li data-id=${bcjData[i].titleId} class="${i == 0 ? "active" : ""}">${bcjData[i].title}</li>`;
                }
                $('.bcj_title_list').html(html);

                var leftScroll = new IScroll('.bcj_title', {
                    mouseWheel: true,
                    scrollX: true,
                    click: true

                });
            }
        );
    }
    // 白菜价内容数据

    function bcjContentData(index) {
        $.ajax({
            type: "get",
            url: "http://193.112.55.79:9090/api/getbaicaijiaproduct",
            data: {titleid :index},
            dataType: "json",
            success: function (result) {
                // console.log(result)
                contentData=result.result;
                // console.log(contentData)
                contentRender()
               
            }
        });
    }
    
    function eventList() {
        // 标题点击事件
        $(".bcj_title_list ").on("tap", "li", function () {

            $(this).addClass("active").siblings().removeClass("active");

            // 获取 被点击的li标签的索引 $(this).index()
            let index = $(this).index();
            // let index = $(this).attr("data-id");
            bcjContentData(index)
           
            
            
        })
        // debugger

    }
    // 内容的渲染
    function contentRender(){
        let html = template('mainTpl', { arr: contentData });
        $('.bcj_content_list').html(html);
    }


})